/**
 * @author Julie
 */

$('#canvas').mousedown(function (e)
{
	var mouseX = e.pageX - this.offsetLeft;
	var mouseY = e.pageY - this.offsetTop;
	
	paint = true;
	addClick(e.pageX - this.offsetLeft, e.pageY - this.offsetTop);
	redraw();
});

$('#canvas').mousemove(function (e)
{
	if(paint)
	{
		addClick(e.pageX - this.offsetLeft, e.pageY - this.offsetTop, true);
		redraw();
	}
});

$('#canvas').mouseup(function (e)
{
	paint = false;
})

$('#canvas').mouseleave(function (e)
{
	paint = false;
})

var clickX = new Array();
var clickY = new Array();
var clickDrag = new Array();
var paint;

function addClick(x, y, dragging)
{
	clickX.push(x);
	clickY.push(y);
	clickDrag.push(dragging);
}

function redraw_Pen()
{
	canvas.width = canvas.width;
	context.strokStyle = "#df4b26";
  	context.lineJoin = "round";
  	context.lineWidth = 5;	
	for(var i=0; i<clickX.length; i++)
	{
		context.beginPath();
		if(clickDrag[i] && i )
		{
			context.moveTo(clickX[i-1], clickY[i-1]);
		}
		else
		{
			context.moveTo(clickX[i]-1, clickY[i]-1);
		}
		context.lineTo(clickX[i], clickDrag[i]);
		context.closePath();
		context.stroke();
	}
}

function canvasToimage()
{
	var myImage = document.getElementById('myImage');
  	myImage.src = canvas.toDataURL();
}

function setCurrAction(id)
{
	switch(id)
	{
		case 1 : redraw_Pen(); break;
		case 2 : break;
		case 3 : break;
		case 4 : canvasToimage(); break;
		default : break;
	};
}
